import {
  frameworks,
  url,
  setOptions,
  initSurvey,
  getSurveyResult
} from "../settings";
import { Selector, ClientFunction } from "testcafe";
const assert = require("assert");
const title = `visibleTrigger`;

const json = {
  triggers: [
    {
      type: "visible",
      name: "type",
      operator: "equal",
      value: "Hot hatch",
      questions: ["Hot hatch"]
    },
    { type: "visible", name: "type", value: "sedan", questions: ["Sedan"] },
    { type: "visible", name: "type", value: "sports", questions: ["Sports"] },
    {
      type: "visible",
      name: "type",
      value: "Grand tourer",
      questions: ["Grand tourer"]
    },
    {
      type: "visible",
      name: "type",
      value: "SuperCar",
      questions: ["Supercar"]
    },
    {
      type: "visible",
      name: "type",
      value: "Muscle car",
      questions: ["Muscle car"]
    },
    {
      type: "visible",
      name: "type",
      value: "Pony car",
      questions: ["Pony car"]
    },
    {
      type: "visible",
      name: "type",
      value: "Convertible",
      questions: ["Convertible"]
    },
    { type: "visible", name: "type", value: "other", questions: ["otherType"] }
  ],
  questions: [
    {
      type: "radiogroup",
      name: "type",
      isRequired: true,
      colCount: 4,
      hasOther: true,
      title: "Please select the sport cars type.",
      choices: [
        "Hot hatch",
        "sedan|Sports saloon / sports sedan",
        "sports|Sports Car",
        "Grand tourer",
        "SuperCar",
        "Muscle car",
        "Pony car",
        "Convertible"
      ]
    },
    {
      type: "radiogroup",
      name: "Hot hatch",
      isRequired: true,
      colCount: 4,
      visible: false,
      title: "Please select the car",
      hasOther: true,
      choices: ["Honda Civic Type R", "Renault Megane RS", "Fiat 500 Abarth"]
    },
    {
      type: "radiogroup",
      name: "Sedan",
      isRequired: true,
      colCount: 4,
      visible: false,
      title: "Please select the car",
      hasOther: true,
      choices: [
        "BMW M5",
        "Mazdaspeed6/Mazda 6 MPS",
        "Dodge Charger",
        "Dodge SRT-4",
        "Lotus Cortina",
        "Mitsubishi EVO"
      ]
    },
    {
      type: "radiogroup",
      name: "Sports",
      isRequired: true,
      colCount: 4,
      visible: false,
      title: "Please select the car",
      hasOther: true,
      choices: ["Chevrolet Corvette", "Mazda MX-5", "Porsche 911"]
    },
    {
      type: "radiogroup",
      name: "Grand tourer",
      isRequired: true,
      colCount: 4,
      visible: false,
      title: "Please select the car",
      hasOther: true,
      choices: ["Aston Martin V8", "Lexus SC300/400", "Ferrari 612 Scaglietti"]
    },
    {
      type: "radiogroup",
      name: "Supercar",
      isRequired: true,
      colCount: 4,
      visible: false,
      title: "Please select the car",
      hasOther: true,
      choices: ["McLaren P1", "Lamborghini Miura", "Bugatti Veyron 16.4"]
    },
    {
      type: "radiogroup",
      name: "Muscle car",
      isRequired: true,
      colCount: 4,
      visible: false,
      title: "Please select the car",
      hasOther: true,
      choices: [
        "Ford Torino",
        "Plymouth Road Runner",
        "Pontiac GTO",
        "Ford Falcon",
        "Holden Monaro",
        "Valiant Charger"
      ]
    },
    {
      type: "radiogroup",
      name: "Pony car",
      isRequired: true,
      colCount: 4,
      visible: false,
      title: "Please select the car",
      hasOther: true,
      choices: ["AMC Javelin", "Chevrolet Camaro", "Dodge Challenger"]
    },
    {
      type: "radiogroup",
      name: "Convertible",
      isRequired: true,
      colCount: 4,
      visible: false,
      title: "Please select the car",
      hasOther: true,
      choices: ["Honda S2000", "Volkswagen Eos", "Volvo C70"]
    },
    {
      type: "comment",
      name: "otherType",
      title: "Please describe the car.",
      isRequired: true,
      visible: false
    }
  ]
};

frameworks.forEach(framework => {
  fixture`${framework} ${title}`.page`${url}${framework}`.beforeEach(
    async t => {
      await initSurvey(framework, json);
    }
  );

  test(`check visibility`, async t => {
    let surveyResult;

    await t
      .click(`input[value="Hot hatch"]`)
      .hover(`input[value="Honda Civic Type R"]`)
      .hover(`input[value="Fiat 500 Abarth"]`)
      .click(`input[value="Pony car"]`)
      .click(`input[value="Dodge Challenger"]`)
      .click(`input[value="Complete"]`);

    surveyResult = await getSurveyResult();
    assert.deepEqual(surveyResult, {
      type: "Pony car",
      "Pony car": "Dodge Challenger"
    });
  });
});
